<!-- 本页样式 -->
<style scoped lang="scss">
.del-dialog-cnt {
  font-size: 16px;
  text-align: center;
}
.passdialog{
  position: absolute; 
  width: 100%; 
  height: 100%; 
  top: 0; 
  left: 0;
  .confirmdiv{
    width: 50%;
    padding: 20px;
    margin: 12px auto;
    .title{
      line-height: 24px;
      font-size: 18px;
      color: #303133;
    }
  }
}
</style>
<!-- 页面布局-->
<template>
  <div class="table">
    <!-- 主体区 -->
    <div class="container">
        <div class="fxrow fxsc width100" style="margin-top: 50px;justify-content: space-around;height: 120px;">
            <div>
                <el-button type="warning" @click="cancelDel()">撤销作废申请</el-button>
            </div>
            <div>
                <el-button type="primary" @click="vopStatusPreTrue()">联通方作废申请已通过</el-button>
            </div>
            <div>
                <el-button type="info" @click="vopStatus('false')">联通方作废申请未通过</el-button>
            </div>
        </div>
        <!-- 按钮操作区 -->
        <span slot="footer" class="form-btn-box">
          <el-button @click="cnacelForm()">关 闭</el-button>
        </span>
        <!-- 按钮操作区END -->
    </div>
    <!-- 主体区END -->
    <div v-show="delDialogVisible" class="passdialog" style="background-color: rgba(0,0,0,.2);">
      <div class="confirmdiv" style="background-color: rgb(255,255,255);">
        <div class="title">作废批次</div>
        <div class="delconfirm" style="font-weight: bold;">警告：将作废本申请批次，无法恢复！</div>
        <div class="delconfirm">为防止意外，确认继续操作请输入以下内容：</div>
        <div class="delconfirm" style="font-weight: bold;color: black;"><span style="border-bottom: 2px dashed red;">{{ delApplyBatchNo }}</span></div>
        <div>
          <el-input v-model="confirmDelApplyBatchNo" clearable placeholder="请输入提示内容以确认继续操作" class="delconfirminput"></el-input>
        </div>
        <div v-show="showDeltips" style="color: red;">批次号错误</div>
        <div class="box-bottom" style="margin-top: 20px;">
          <el-button type="primary" style="margin-right: 36px;" @click="vopStatus('true')" :disabled="disableDelBtn">确 定</el-button>
          <el-button @click="delDialogVisible = false">取 消</el-button>
        </div>
      </div>
    </div>
  </div>
</template>


<script>
export default {
  data() {
    return {
      cardApplyBatchId: "",
      delDialogVisible: false,
      delApplyBatchNo: "",
      confirmDelApplyBatchNo: "",
      showDeltips: false,
    };
  },
  computed:{
    disableDelBtn: function() {
      if(this.confirmDelApplyBatchNo == "" || this.confirmDelApplyBatchNo == undefined || this.confirmDelApplyBatchNo == null) return true;
      else return false;
    }
  },
  props: {
    sourceData: {
      required: true
    }
  },
  mounted(){
    this.handleInitLoad();
  },
  methods: {
    handleInitLoad(){
      this.cardApplyBatchId = this.sourceData.seleid;
      this.delApplyBatchNo = this.sourceData.delApplyBatchNo;
    },

    /**
     * 取消返回
     * @augments formName 表单名称
     */
    cnacelForm() {
      this.$emit("cancel", null);
    },

    /**
     * 撤销作废申请
     */
    cancelDel(){
        var url = `/rps/cardApplyBatch/${this.cardApplyBatchId}/cancelDelete/`;
        this.$util.loadingshow();
        this.$axios
            .put(url, null, {
                headers: {
                    operator: this.$util.getLoginer().userid,
                    withCredentials: true
                }
            })
            .then(res => {
                this.$util.loadinghide();
                let data = res.data;
                if (data.success) {
                    this.$message({
                        message: "撤销成功",
                        type: "success"
                    });
                    this.$emit("ok", null);
                } else {
                    this.$error(data.message);
                }
            })
            .catch(err => {
                this.$util.loadinghide();
            });
    },

    vopStatusPreTrue(){
      this.delDialogVisible = true;
      this.confirmDelApplyBatchNo = "";
    },

     /**
     * 联通方撤销已同意
     */
    vopStatus(flag){
      if(flag == "true"){
        if(this.confirmDelApplyBatchNo.trim() != this.delApplyBatchNo){
          this.showDeltips = true;
          return;
        }else{
          this.showDeltips = false;
        }
      }
      var url = `/rps/cardApplyBatch/${this.cardApplyBatchId}/finishDelete/${flag}/`;
      this.$util.loadingshow();
      this.$axios
          .put(url, null, {
              headers: {
                  operator: this.$util.getLoginer().userid,
                  withCredentials: true
              }
          })
          .then(res => {
              this.$util.loadinghide();
              let data = res.data;
              if (data.success) {
                this.delDialogVisible = false;
                  this.$message({
                      message: "我方同步处理成功",
                      type: "success"
                  });
                  this.$emit("ok", null);
              } else {
                  this.$error(data.message);
              }
          })
          .catch(err => {
              this.$util.loadinghide();
          });
    },
  }
};
</script>
